{% extends '__base.tpl' %}

{% block head %}
{{super()}}
<!-- build:css -->
    <link rel="stylesheet" type="text/css" href="../../../public/css/page/answer.css" />
<!-- endbuild -->
{% endblock %}

{% block middle %}
    <!-- end left -->
    <div id='middle'>
        <!--------------分类start---------------->
        <!--主导航-->
        <div class="nav category">
            <div class="hot-nav">
                <a {% if data.parentId=='' %} class="hover" {% endif %}
                   href ='/video.html?orderByField=playCount'>热门</a>
            </div>
            <ul class="clearfix main-ul">
                {% for item in data.category %}
                <li>
                    <a {% if data.parentId == item.id %} class="hover" {% endif %}
                       href='/video.html?parentId={{item.id}}'>{{ item.name }}</a>
                </li>
                {% endfor %}
            </ul>
        </div>
        <!--子导航-->
        <div class="hide" {% if data.parentId %} style="display:block;" {% endif %}>
            <div class="nav sub-nav category">
                {% for item in data.category %}
                <ul class="hide clearfix" {% if data.parentId==item.child[0].parentId %} style="display:block;" {% endif %}>
                    <li>
                        <a href='/video.html?parentId={{item.child[0].parentId}}'
                           {% if data.categoryId==data.parentId and (data.parentId == item.child[0].parentId) %} class="hover" {% endif %}>
                            全部
                        </a>
                    </li>
                    {% for child in item.child %}
                    <li>
                        <a {% if data.categoryId == child.id %} class="hover" {% endif %}
                           href='/video.html?parentId={{child.parentId}}&categoryId={{child.id}} '>
                            {{ child.name }}
                        </a>
                    </li>
                    {% endfor %}
                </ul>
                {% endfor %}
                <!-- <span class="more">更多</span>-->
            </div>
            <!--学习路线图-->
            {% for item in data.category %}
            <div class="lenImg center">
                {% if item.id==data.parentId and item.learnPathImg %}
                <img width="100%" src="{{item.learnPathImg|imgPath}}">
                {% endif %}
            </div>
            {% endfor %}
        </div>
        <!--------------------分类end----------------------->
        <!--专辑列表start-->
        <div class="listCon" id="middleListContent">
            <ul class="clearfix content" >
                {% if data.videoData.list.length>0 %}
                {% for item in data.videoData.list %}
                <li>
                    <div class="listConLeft">
                        <a target="_blank" href="/{{item.id}}/video_content.html">
                            <img class="content-img" src="{{item.cover|imgPath}}">
                        </a>
                    </div>
                    <div class="listConRight">
                        <h3 class="title">
                            <a target="_blank"  class="clo3" href="/{{item.id}}/video_content.html">
                                {{item.name|safe}}
                            </a>
                        </h3>
                        <div class="desc">
                           {% if item.price==0 and item.gold==0 %}
                            <i class="listIcon">免费</i>
                           {% endif %}
                           <em class="blue">{{item.tags}}</em>
                            {% if item.memberNickName %}
                            · 主讲人：<a href="/{{item.memberId}}/userInfo.html" target="_blank">{{item.memberNickName}}</a>
                            {%endif%}
                            · {{item.videoCount}}课时
                            · {{item.playCount}}点播次数
                        </div>
                    </div>
                </li>
                {% endfor %}
                {% else %}
                <li class="no-data">
                    {% include '__no_data.html' %}
                </li>
                {% endif %}
            </ul>
            <script id="middleListContent_tpl" type="text/html">
                <%each data as item i %>
                <li>
                    <div class="listConLeft">
                        <a target="_blank" href="/<%item.id%>/video_content.html">
                            <img class="content-img" src="<%=imgPath(item.cover)%>">
                        </a>
                    </div>
                    <div class="listConRight">
                        <h3 class="title">
                            <a target="_blank"  class="clo3" href="/<%item.id%>/video_content.html"><%item.name%></a>
                        </h3>
                        <div class="desc">
                            <%if item.price==0 && item.gold==0 %>
                            <i class="listIcon">免费</i>
                            <%/if%>
                            <em class="blue"><%item.tags%></em>
                            <%if item.memberNickName %>
                            · 主讲人：<a href="/<%item.memberId%>/userInfo.html" target="_blank"><%item.memberNickName%></a>
                            <%/if%>
                            · <%item.videoCount%>课时
                            · <%item.playCount%>点播次数
                        </div>
                    </div>
                </li>
                <%/each%>
            </script>
            <div class="loading">正在加载中...</div>
            <div class="nomore-data">---到底了---</div>
        </div>

        <!--专辑列表end-->
    </div>
{% endblock %}
{% block right %}
    {% include '__indexRight_search.html' %}
    {% include '__indexRight_memberCard.html' %}
    <div class="right-section hide need-fixed" {% if  data.videoRecom.list.length>0 %} style="display:block;" {% endif %}>
        <h3 class="right-top-title">推荐</h3>
        <ul class="right-section-content video-list">
            {% for item in data.videoRecom.list %}
            <li class="video-list-item">
                <a target="_blank" href='/{{item.id}}/video_content.html'>
                    <div class="video-list-img-box">
                        <img width="100%" src="{{item.cover|imgPath}}">
                    </div>
                </a>
                <h3 class="video-list-title">
                    <a target="_blank" href='/{{item.id}}/video_content.html'>
                        {% if item.price==0 and item.gold==0 %}
                        <i class="listIcon">免费</i>
                        {% endif %}
                        {{item.name|safe}}
                    </a>
                </h3>
            </li>
            {% endfor %}
        </ul>
    </div>
{% endblock %}
{% block script %}
    {{ super() }}
<!-- build:js -->
<script src="../../../public/js/page/video/video.js"></script>
<!-- endbuild -->
{% endblock %}